#news .container {
    padding-top: 2vw;
    padding-bottom: 2vw;
    & > h3{
        color: #ff6b08;
        font-size: 30px;
    }
    .head{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 25px;
        margin-top: 20px;
        .item{
            width: 100%;
            position: relative;
            border: 1px solid #eeeeee;
            overflow: hidden;
            border-radius: 5px;
            img{
                width: 100%;
            }
            & > p{
                background-color: rgba(0, 0, 0, 0.5);
                position: absolute;
                bottom: 0;
                width: 100%;
                color: #fff;
                text-align: center;
                padding: 10px 0;
            }
        }
    }

    .content{
        margin-top: 5vw;
        padding-bottom: 5vw;
        border-bottom: 1px dashed #dddddd;
        .item{
            margin-top: 3vw;
            display: flex;
            position: relative;
            .img{
                padding: 5px;
                width: 30%;
                border: 1px solid #dddddd;
                img{
                    width: 100%;
                }
            }
            .text{
                margin-left: 2vw;
                color: #2a2a2a;
                & > p:first-child{
                    font-size: 20px;
                    color: #666666;
                }
                & > p:nth-child(2){
                    margin-top: 8px;
                    line-height: 30px;
                }
                & > p:last-child{
                    margin-top: 8px;
                    line-height: 30px;
                }
            }
            & > button{
                position: absolute;
                right: 0;
                bottom: 0;
                background-color: #ff6b08;
                color: #fff;
                padding: 5px 20px;
                border: none;
                border-radius: 15px;
                cursor: pointer;
            }
        }
    }
}

#page{
    text-align: center;
}

@media screen and (max-width: 1280px){
    #news .container{
        .content{
            .item{
                .img{
                    width: 100%;
                }
            }
        }
    }
}

@media screen and (max-width: 768px){
    #news .container{
        .head{
            grid-template-columns: 1fr;
            .item{
                width: 100%;
            }
        }
        .content{
            .item{
                .img{
display: none;
                }
            }
        }
    }
}